<div nz-row>
        <nz-col nzSpan='24'>
            <nz-input-group [nzSuffix]="suffixIcon" [ngStyle]="{ 'margin-bottom': '10px' }">
                <input
                    type="text"
                    nz-input
                    placeholder="输入关键字快速查找"
                    [(ngModel)]="searchValue"
                />
            </nz-input-group>
            <ng-template #suffixIcon>
                <i nz-icon nzType="search"></i>
            </ng-template>
            <nz-switch [(ngModel)]='model' nzCheckedChildren='目录' nzUnCheckedChildren='编排'></nz-switch>
            <button nz-button nzType='link' (click)='refresh()'>刷新</button>
            <button *ngIf='model' nz-button nzType='link' (click)='add(null)'><i nz-icon nzType="plus"></i>添加目录</button>
        </nz-col>
        <nz-col nzSpan='24'>
            <nz-tree
                #treeOne
                *ngIf='!model'
                nzBlockNode
                [nzData]="treeData"
                (change)='treeDataChange1()'
                (nzClick)="activeNode($event)"
                (nzDblClick)="open($event)"
                [nzSearchValue]='searchValue'
                [nzSelectedKeys]='selectKey'
                class='tree'
            ></nz-tree>
            <nz-tree
                *ngIf='model'
                nzBlockNode
                [nzData]="treeData"
                (change)='treeDataChange1()'
                (nzClick)="activeNode($event)"
                (nzDblClick)="open($event)"
                [nzTreeTemplate]="nzTreeTemplate"
                (nzExpandChange)='changeExpand()'
                nzDraggable
                (nzOnDragEnd)='dragEnd($event)'
            ></nz-tree>

            <ng-template #nzTreeTemplate let-node let-origin="origin">
              <span>
                <span  (contextmenu)="contextMenu($event, menu,origin)">
                  <span *ngIf='origin.edit == undefined || !origin.edit'>{{origin.title }}</span>
                  <input nz-input #titleInput
                         *ngIf='origin.edit'
                         [(ngModel)]="origin.title"
                         (keydown)='completeEdit($event,origin)'
                         (blur)='elementBlur(origin)'
                  >
                </span>
              </span>
            </ng-template>
<!--            <ng-template #nzTreeTemplate1 let-node let-origin="origin">-->
<!--                  <span class="custom-node">-->
<!--                      <span [style]='node.origin.accessState? "color: cornflowerblue" : "color: black"' >{{node.title}}</span>-->
<!--                         <button nz-button nzType="text" nzSize="small" >-->
<!--                            <i nz-icon nzType="edit" style='color: cornflowerblue' nzTheme="outline"></i>-->
<!--                        </button>-->
<!--                    </span>-->
<!--            </ng-template>-->

            <nz-dropdown-menu #menu="nzDropdownMenu">
                <ul nz-menu>
                    <li nz-menu-item (click)='editStatusChange(currentNode)'>编辑</li>
                    <li nz-menu-item (click)='delete(currentNode)'>删除</li>
                    <li nz-menu-item (click)='add(currentNode)'>新增子分类</li>
                </ul>
            </nz-dropdown-menu>
        </nz-col>
</div>
